// 1.创建 ui 组件
// 2.创建 model
// 3.将 ui 组件和 model 进行连接

import React from 'react';
import { connect } from 'umi';
import { Button } from 'antd';

const Dva = (props) => {
    console.log(props);
    const { dispatch } = props;

    const list = props.tags.tagsList.list || [];

    console.log(list);

    function getData() {
        // 使用 model,获取数据
        dispatch({
            type: 'tags/fetchTags',
            payload: null,
        });
    }

    return (
        <div>
            <h3>Dva 的使用</h3>
            <Button onClick={getData}>获取列表数据</Button>
            {list.map((item, index) => {
                return <p key={index}>{item.name}</p>;
            })}
        </div>
    );
};

export default connect(({ tags }) => ({
    tags,
}))(Dva);
